/*
 * @Author: your name
 * @Date: 2021-04-08 13:45:02
 * @LastEditTime: 2021-04-09 13:23:14
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: \my-app-koa\client\src\common\textFieldGroup.js
 */
import React from 'react'
import classname from 'classname'
import PropTypes from 'prop-types';
const TextAreaFieldGroup = ({
  error,
  placeholder,
  name,
  value,
  onChange,
  info,
}) => {
  return (
    <div className="form-group">
      <textarea
        className={classname('form-control form-control-lg', {
          'is-invalid': error
        })}
        placeholder={placeholder}
        name={name}
        value={value}
        onChange={onChange}
      />
      {
        info && (<small>{info}</small>)
      }
      {
        error && (<div className="invalid-feedback">
          {error}
        </div>)
      }
    </div>
  )
}

TextAreaFieldGroup.propTypes = {
  error: PropTypes.string,
  placeholder: PropTypes.string,
  name: PropTypes.string.isRequired,
  value: PropTypes.string,
  onChange: PropTypes.func.isRequired,
  info: PropTypes.string,
}




export default TextAreaFieldGroup